<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        <title>Edição de Pessoas</title>
    </h:head>
    <h:body>
        <h:form>
            <h:messages />
            <!--Atributo rendered define se o componente será processado ou não-->
            <h:panelGroup rendered="#{controlePessoa.opcaoSelecionada==false}">
                Selecione o tipo de pessoa
                <!-- O atributo layout define a forma como será apresentado os 
                elementos. lineDirection mostra as opções em uma linha só.
                onchange > ao mudar o valor eu vou fazer um submit() neste formulário.
                valueChangeListener dispara um método quando o formulário é submetido.
                Ao mudar o valor do formulário será executada a propriedade valueChangeListener.-->
                <h:selectOneRadio value="#{controlePessoa.pessoaFisica}" 
                                  layout="lineDirection"
                                  onchange="submit()"
                                  valueChangeListener="#{controlePessoa.tipoChange}"
                                  >
                    <f:selectItem itemLabel="Pessoa Física" itemValue="true"/>
                    <f:selectItem itemLabel="Pessoa Jurídica" itemValue="false"/>

                </h:selectOneRadio>


            </h:panelGroup>
            <h:panelGroup rendered="#{controlePessoa.opcaoSelecionada==true}" >
                <h:panelGrid columns="2">
                    <h:outputLabel value="ID"/>
                    <h:inputText value="#{controlePessoa.id}"/>
                    <h:outputLabel value="Nome" 
                                   rendered="#{controlePessoa.pessoaFisica==true}"/>
                    <h:outputLabel value="Razão Social" 
                                   rendered="#{controlePessoa.pessoaFisica==false}"/>
                    <h:inputText value="#{controlePessoa.nome}" 
                                 size="40"/>
                    <h:outputText value="CPF" 
                                  rendered="#{controlePessoa.pessoaFisica==true}"/>
                    <h:inputText value="#{controlePessoa.cpf}" 
                                 size="11"
                                 rendered="#{controlePessoa.pessoaFisica==true}"/>
                    <h:outputText value="CNPJ" rendered="#{controlePessoa.pessoaFisica==false}"/>
                    <h:inputText value="#{controlePessoa.cnpj}"
                                 size="14"
                                 rendered="#{controlePessoa.pessoaFisica==false}"/>
                </h:panelGrid>
                <h:commandButton value="Enviar"
                    action="#{controlePessoa.exibirDados()}" />
            </h:panelGroup>
        </h:form>
    </h:body>
</html>

